﻿<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>My JSP 'sys_user_info_lits.jsp' starting page</title>
   
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<link rel="shortcut icon" href="${ctx }/ico/favicon.ico"> 
	<link href="${ctx }/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${ctx }/css/font-awesome.css?v=4.4.0" rel="stylesheet">
     <link href="${ctx }/css/common.css" rel="stylesheet">
    <!-- jqgrid-->
    <link href="${ctx }/css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet">
	<link href="${ctx }/css/plugins/jsTree/style.min.css" rel="stylesheet">
    <link href="${ctx }/css/animate.css" rel="stylesheet">
    <link href="${ctx }/css/common.css" rel="stylesheet">
    <link href="${ctx }/css/style.css?v=4.1.0" rel="stylesheet">
    <!-- Sweet Alert -->
    <link href="${ctx }/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
	<link href="${ctx }/css/plugins/bootstrap-table/bootstrapValidator.css" rel="stylesheet">
  </head>
	  <body class="gray-bg">
			<div class="row">
				<div class="col-sm-12">
					<div class="ibox">
						<div class="ibox-content">
							<div class="row m-b-sm m-t-sm">
								<div class="col-md-11">
									<div class="input-group">
										<button class="btn btn-success btn-outline commonbtn" type="button" id="addSysUserInfo"><i class="fa fa-plus"></i> 添加</button>
										<button class="btn btn-success btn-outline commonbtn" type="button" id="editSysUserInfo"><i class="fa fa-pencil"></i> 编辑</button>
										<button class="btn btn-success btn-outline commonbtn" type="button" id="delSysUserInfo"><i class="fa fa-trash"></i> 删除</button>
<!-- 										<button class="btn btn-success btn-outline" type="button" id="querySyncUserInfo"><i class="fa fa-download"></i> 成员同步</button>
 -->										<input type="text" placeholder="请输入用户名称" class="input-sm form-control" style="float: right;height:100%;width:30%" id="search">
										<span class="input-group-btn"><button type="button" class="btn btn-sm btn-sm btn-primary commonsearch" id="searchBtn">搜索</button></span>
									</div>
								</div>
							</div>
							<div class="jqGrid_wrapper" class="sk-spinner sk-spinner-fading-circle">
								<table id="table_list"></table>
								<div id="pager_list"></div>
							</div>
						</div>
					</div>
				</div>
			</div>
		
	<!-- 添加用户模块窗口 (如果下边框没显示，#addSysUserInfoWin加padding-bottom) -->
	<div class="modal inmodal"  id="addSysUserInfoWin" style='padding-bottom:100px' tabindex="-1" role="dialog" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content animated bounceInRight" >
				<div class="modal-header">
					<button type="button" class="close closeWin" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">关闭</span>
					</button>
					<h5 class="modal-title">添加用户</h5>
				</div>
				<div class="ibox-content" >
					<form class="form-horizontal m-t" id="addSysUserInfoFrom" name="addSysUserInfoFrom" method="post">
					    <input type="hidden" name="org_id" id="org_id" value="${org_id}">
					    
					    <div class="form-group">
							<label class="col-sm-3 control-label">当前部门：</label>
							<div class="col-sm-8">
								<strong>${org_name}</strong>
							</div>
						</div>
						
						<div class="form-group">
							<label class="col-sm-3 control-label">用户编号:</label>
							<div class="col-sm-8">
								<input id="emp_id" name="emp_id" class="form-control"     required="" aria-required="ture" type="text" placeholder="成员ID，作为用户的唯一账户" >
							</div>
						</div>
						<div class="form-group">
                        	<label class="col-sm-3 control-label">用户姓名：</label>
                            <div class="col-sm-8">
                            	<input id="emp_name" name="emp_name" class="form-control"  required="" aria-required="true" type="text" placeholder="请输入用户姓名">                                    
                            </div>
                        </div>
						
						<div class="form-group">
                        	<label class="col-sm-3 control-label">用户电话：</label>
                            <div class="col-sm-8">
                            	<input id="mobile_phone" name="mobile_phone" class="form-control" required=""  aria-required="true" type="text" placeholder="请输入手机号码">                                    
                            </div>
                        </div>
                        <div class="form-group">
                        	<label class="col-sm-3 control-label">座机：</label>
                            <div class="col-sm-8">
                            	<input id="telephone" name="telephone" class="form-control"  aria-required="true" type="text" placeholder="请输入座机">                                    
                            </div>
                        </div>
                        <div class="form-group">
                        	<label class="col-sm-3 control-label">邮箱地址：</label>
                            <div class="col-sm-8">
                            	<input id="email" name="email" class="form-control"  aria-required="true" type="text" placeholder="请输入邮箱地址">                                    
                            </div>
                        </div>
                        
                        <div class="form-group">
                        	<label class="col-sm-3 control-label">用户性别：</label>
                            <div class="col-sm-8">
                            	<input type="radio" id="sex" name="sex" value="1" checked="checked">男
                            	<input type="radio" id="sex" name="sex" value="0" >女
                            </div>
                        </div>
                          
                     <div class="form-group">
                        	<label class="col-sm-3 control-label">职务：</label>
                            <div class="col-sm-8">
                            	<input id="position" name="position" class="form-control" aria-required="true" type="text" placeholder="请输入职务名称">                                  
                            </div>
                        </div> 
                       <div class="form-group">
                        	<label class="col-sm-3 control-label">专业：</label>
                            <div class="col-sm-8">
                            	<input id="professional" name="professional" class="form-control" aria-required="true" type="text" placeholder="请输入专业名称">                                    
                            </div>
                        </div>
                       <div class="form-group">
                        	<label class="col-sm-3 control-label">排序：</label>
                            <div class="col-sm-8">
                            	<input id="emp_order" name="emp_order" class="form-control" required="" aria-required="true" type="number" placeholder="请输入排序号">                                    
                            </div>
                        </div> 
						<div class="form-group">
							<div class="col-sm-8 col-sm-offset-3">                                   
                                    <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                					<button type="submit" class="btn btn-primary">保存</button>
                            </div>
                   		</div>
					</form>
				</div>
			</div>
		</div>
	</div>

	<!-- 修改用户模态窗口 -->
  	<div class="modal inmodal" id="editSysUserInfoWin"  role="dialog" aria-hidden="true" style="padding-bottom:30px">
                     <iframe id="editSysUserInfoFrame" width="100%" height="100%" frameborder="0" >
                     </iframe>
  	</div>
	<!--end 修改用户模态窗口 -->
		
				<!-- 全局js -->
	    <script src="${ctx }/js/jquery.min.js?v=2.1.4"></script>
	    <script src="${ctx }/js/bootstrap.min.js?v=3.3.6"></script>
	    <!-- Peity -->
	    <script src="${ctx }/js/plugins/peity/jquery.peity.min.js"></script>
	    <!-- jqGrid -->
	    <script src="${ctx }/js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
	    <script src="${ctx }/js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>
	    <!-- jQuery Validation plugin javascript-->
	    <script src="${ctx }/js/plugins/validate/jquery.validate.min.js"></script>
	    <script src="${ctx }/js/plugins/validate/messages_zh.min.js"></script>
		<!-- layer javascript -->
		<script src="${ctx }/js/plugins/layer/layer.min.js"></script>
		<!-- jQuery form-->
		<script src="${ctx }/js/jquery.form.js"></script>
	    <!-- 自定义js -->
	    <script src="${ctx }/js/content.js?v=1.0.0"></script>
	    <!-- jsTree plugin javascript -->
	    <script src="${ctx }/js/plugins/jsTree/jstree.min.js"></script>
	    <script src="${ctx }/js/plugins/layer/laydate/laydate.js"></script>
	    <!-- Sweet alert -->
    	<script src="${ctx }/js/plugins/sweetalert/sweetalert.min.js"></script>
	    <script src="${ctx }/js/plugins/bootstrap-table/bootstrapValidator.js"></script>
	    <script type="text/javascript">
		    $(document).ready(function () {
				$.jgrid.defaults.styleUI = 'Bootstrap';
				// Examle data for jqGrid
				var searchString='';
				//绑定表格数据
				$("#table_list").jqGrid({
					postData:{name: searchString},
					url:"${ctx}/organize/loadDataGrid?org_id=${org_id}",		        	
					datatype: "json",
					height: "calc(100% - 265px)",
					autowidth: true,
					shrinkToFit: true,
					multiselect: true,
					multiboxonly:true,  
					beforeSelectRow: beforeSelectRow,
					rowList: [10, 20, 30],
					root:"rows",
					colNames: ['用户ID','姓名','手机号码','性别','所属部门'],
					colModel: [
					{
						name: 'emp_id',
						index: 'emp_id',
						width: 40,
						sorttype: "String",
						key:"ture"
					},
					{
						name: 'emp_name',
				        index: 'emp_name',		            
				        width: 30
				    },
				    {
				        name: 'mobile_phone',		           	
				        index: 'mobile_phone',
				        width: 40
				    },
				    {
				    	name: 'sex',		           	
				        index: 'sex',
				        width: '20',
				        formatter: "select", editoptions:{value:"0:女;1:男;"}	
				    },
				     {
				        name: 'org_name',		           	
				        index: 'org_name',
				        width: 70,
		         		formatter : function(cellvalue, options, rowObject) {
		           		var v_orgs=rowObject.sysOrgInfoList;
						if(v_orgs==null||v_orgs==""){
            		         var spa='<span style="color: red;">未分配部门！</span>';
            		           return spa;
            		      }else{
            		        var org_name='';
            		        for(var i=0; i<rowObject.sysOrgInfoList.length; i++){
            		        if (org_name != '') org_name += '、';
				             org_name += rowObject.sysOrgInfoList[i].org_name;
            		        return org_name;
						  }
            		    }	
				    }
		       }],
				    sortable:true,
				    sortname: 'emp_order',
				    sortorder: 'asc',
				    pager: "#pager_list",
                    caption: "成员列表",
				});
			});
		// jqGrid 自动调整宽度
		$(window).bind('resize', function () {
      		var width = $('.jqGrid_wrapper').width();
     		$('#table_list').setGridWidth(width);       		
   		});
		//单选空间
		function beforeSelectRow()  
        {  
            $("#jqgridId").jqGrid('resetSelection');  
            return(true);  
        }
		
	    //绑定查询事件
        $("#searchBtn").click(function(){
        	var searchString = $("#search").val(); 
	        $("#table_list").jqGrid('setGridParam',{ 
	            url:"${ctx }/organize/loadDataGrid", 
	            postData:{'emp_name':searchString}, //发送数据 
	            page:1
	        }).trigger("reloadGrid"); //重新载入 
    	});
    	
    	$('#pass').blur(function() {
			var reg = /^(?=.*[0-9].*)(?=.*[A-Z].*)(?=.*[a-z].*).{8,20}$/;
			var v_password = $('#pass').val();
			$('#pass').next().remove();
			if (v_password.match(reg) == null) {
				var spa = '<span class="help-block m-b-none" style="color: red;">密码必须包含英文大写、小写和数字，长度为8-20位</span>';
				$('#pass').after(spa);
				return false;
			}
			if (v_password.length < 8) {
				var spa = '<span class="help-block m-b-none" style="color: red;">密码不能小于8位</span>';
				$('#pass').after(spa);
				return false;
			}
			/* var v_userName = $('#account')
					.val();
			if (v_userName == v_password) {
				var spa = '<span class="help-block m-b-none" style="color: red;">账户和密码不能一致</span>';
				$('#password').after(spa);
				return false;
			} */
		});
		
		$('#password').blur(function(){
			var pass1=$('#pass').val();
			var pass2=$('#password').val();
			if(!pass2){
				return ;
			}
			$('#password').next().remove();
			if(pass1!=pass2){
				var spa = '<span class="help-block m-b-none" style="color: red;">两次密码不一致</span>';
				$('#password').after(spa);
				return false;
			}
			
		});
    	
    	changeLevel('1');//默认不是揽件员
    	function changeLevel(value){
    		//console.log();
    		if(value=='0'){
    			$("#account").parent().parent().show();
    			$("#account").attr("required","");
    			
    			$("#pass").parent().parent().show();
    			$("#pass").attr("required","");
    			$("#password").parent().parent().show();
    			$("#password").attr("required","");
    			/* $("#telephone").parent().parent().hide();
    			$("#email").parent().parent().hide();
    			$("#position").parent().parent().hide(); */
    			//$("#isleader").parent().parent().hide();
    		}else{
    			$("#account").parent().parent().hide();
    			$("#account").removeAttr("required");
    			$("#pass").parent().parent().hide();
    			$("#pass").removeAttr("required");
    			$("#password").parent().parent().hide();
    			$("#password").removeAttr("required");
    			/* $("#telephone").parent().parent().show();
    			$("#email").parent().parent().show();
    			$("#position").parent().parent().show(); */
    			//$("#isleader").parent().parent().show();
    		}
    	}
    	
    	//绑定add表单提交事件,异步提交表单
        $("#addSysUserInfoFrom").submit(function(){
        	
        	var val=$("#addSysUserInfoFrom").find("input:radio[name='level']:checked").val();
        	
        	if(val=='1'){
    			$("#account").val('');
    			$("#pass").val('');
    			$("#password").val('');
    		}
    		var empId=$('#emp_id').next().text();
    		if(empId){
    			return false;
    		}
            $('#emp_id').next().remove();
            var v_emp_id = $('#emp_id').val();
			if(v_emp_id=null||v_emp_id==''){
				var spa='<span class="help-block m-b-none" style="color: red;">用户ID不能为空，请输入！</span>';
				$('#emp_id').after(spa);
				return false;
    		}
        	$('#emp_name').next().remove();
            var v_emp_name = $('#emp_name').val();
			if(v_emp_name=null||v_emp_name==''){
				var spa='<span class="help-block m-b-none" style="color: red;">用户姓名不能为空，请输入！</span>';
				$('#emp_name').after(spa);
				return false;
    		}
    		$('#mobile_phone').next().remove();
            var v_mobile_phone = $('#mobile_phone').val();
			if(v_mobile_phone=null||v_mobile_phone==''){
				var spa='<span class="help-block m-b-none" style="color: red;">用户手机号码不能为空，请输入！</span>';
				$('#mobile_phone').after(spa);
				return false;
    		}
    		
    		 var pass1=$('#pass').val();
			var pass2=$('#password').val();
			$('#password').next().remove();
			if(pass1!=pass2){
				var spa = '<span class="help-block m-b-none" style="color: red;">两次密码不一致</span>';
				$('#password').after(spa);
				return false;
			} 
			var text=$('#account').next().text();
			if(text){
				return false;
			}
        	$.ajax({
		    	type: "post",
		    	url: "${ctx }/organize/add_sys_user",
		     	data: $('#addSysUserInfoFrom').serialize(),
		     	dataType:"json",
		     	success: function(data) {
		      		if(data.result=="0")
		      		{
		      			layer.alert(data.msg,{icon: 1}, function(index){		      			
		      				//刷新表格数据
							$("#table_list").trigger("reloadGrid");	
							
							//清空表单数据
							$("#addSysUserInfoWin :input").not(":button, :submit, :reset, :hidden,:radio").val("").remove("selected");
							
							//关闭add窗口
							$('#addSysUserInfoWin').modal('hide');
							//关闭提示框
							layer.close(index);
						});
		      		}else
		      		{
		      			layer.alert(data.msg,{icon: 2});
		      		}
		      	},
		      	error: function() {		      		
		      		layer.alert('添加用户b失败！',{icon: 2});
        		}
        	});
        	return false;
        });
    	
    	$("#delSysUserInfo").click(function () {
        	var selectedIds = $("#table_list").jqGrid("getGridParam", "selarrrow");
        	var ids='';
			for(var i=0;i<selectedIds.length;i++){
			  var v_emp_id=($("#table_list").jqGrid("getRowData",selectedIds[i])).emp_id;
			  if (ids != '') ids += ',';
				ids += v_emp_id;
			}
			if(selectedIds=="")
			{
				layer.alert('请选择一项！',{icon: 0});
				return;
			}
			swal({
				title: "您确定要删除这条信息吗",
				text: "删除后将无法恢复，请谨慎操作！",
				type: "warning",
				showCancelButton: true,
				confirmButtonColor: "#DD6B55",
				confirmButtonText: "删除",
				closeOnConfirm: false
				}, function () {
				$.ajax({
					type: "post",
					dataType:"json",
					url: "${ctx }/organize/deletetSysUser",
					data:  "emp_id="+ids,
					success: function(data) {
						if(data.result=='0')
	   					{
	   						//刷新表格数据
							$("#table_list").trigger("reloadGrid");
							swal("删除成功！", "您已经永久删除了这条信息。", "success");	
						}else
						{
							swal("删除用户失败！", "您未删除这条信息。", "error");
						}
	 				},
					error: function() {
						swal("删除用户失败！", "您未删除这条信息。", "error");
					}
				});
			});
		});
    	
    	//绑定修改按钮事件
        $("#editSysUserInfo").click(function(){
        	var selectedId = $("#table_list").jqGrid("getRowData",$("#table_list").jqGrid("getGridParam", "selarrrow")).emp_id;
        	if(selectedId==null||selectedId=="")
			{
				layer.alert('请选择一项！',{icon: 0});
				return;
			}
			var frameSrc = "${ctx }/organize/editSysUser?emp_id="+selectedId;
			$("#editSysUserInfoFrame").attr("src", frameSrc);
        	$('#editSysUserInfoWin').modal('show');
        });
        
        //关闭修改按钮事件
        function editWinClose(flag)
        {
        	if(flag=="0")
        	{
        		$("#table_list").trigger("reloadGrid");
        	}
			//关闭add窗口
			$('#editSysUserInfoWin').modal('hide');
        }
    	
    	
    	 //绑定新增按钮事件
        $("#addSysUserInfo").click(function(){
        	$('#addSysUserInfoWin').modal('show');
        });
        $('#mobile_phone').blur(function(){
    		$('#mobile_phone').next().remove();
    		var mobile_phone = document.getElementById("mobile_phone").value;
			if (!(/^1(3|4|5|7|8)\d{9}$/.test(mobile_phone))) {
				var spa='<span class="help-block m-b-none" style="color: red;">手机号码有误，请重新输入！</span>';
				$('#mobile_phone').after(spa);
				$('#mobile_phone').focus();
			}
    	});
    	$('#emp_id').blur(function(){
			$('#emp_id').next().remove();
			var emp_id=$('#emp_id').val();
			if(emp_id!=null&&emp_id!='')
			{
				if(!(/^[a-zA-Z][a-zA-Z0-9_]*$/.test(emp_id)))
				{
					var spa='<span class="help-block m-b-none" style="color: red;">英文字母开头，只能包含英文字母、数字、下划线！</span>';
					$('#emp_id').after(spa);
					$('#emp_id').focus();
					return false;
				}
			}
		});
		$('#querySyncUserInfo').click(function(){
		   var v_org_id=$('#org_id').val();
		   if(v_org_id==null){
		      layer.alert('请选择部门同步！',{icon: 0});
		      return false;
		   }
        var index = null;
         layer.confirm("确认要同步吗？同步后不可恢复！",{icon: 3, title:'提示'},
         function() {
		$.ajax({
		type: "POST",
		url: "${ctx }/organize/querySyncUserInfo",
		data: {"org_id":v_org_id},
		dataType:"json",
		beforeSend: function (request) {
			index = layer.load();
			layer.closeAll('dialog');
		},
		success: function(data){
			$("#table_list").trigger("reloadGrid");
			layer.close(index);
			layer.alert(data.msg,{icon: data.result});
		    //添加你的处理代码
			},
			error: function() {
			layer.closeAll('loading');
			layer.alert('同步数据异常!',{icon: 0});
			
			}
		});
	}, function(index){
	  	var index = layer.getFrameIndex(window.name); //先得到当前iframe层的索引
					layer.close(index); //再执行关闭   	
	});
        });
        
        $("#account").blur(function(){
        	
        	 var account=$("#account").val();
        	 if(account==''){
        	 	return;
        	 }
        	 $.ajax({
					type: "post",
					dataType:"json",
					url: "${ctx }/organize/getSysUserByAccount",
					data:  "account="+account,
					success: function(data) {
						$('#account').next().remove();
						if(data.status=='0'){//未被注册
							
						}else{//已被注册
							var spa = '<span class="help-block m-b-none" style="color: red;">该账号已被使用！</span>';
							$('#account').after(spa);
						}
					}
			 });
        });
        
        $("#emp_id").blur(function(){
        	 var emp_id=$("#emp_id").val();
        	 if(emp_id==''){
        	 	return;
        	 }
        	 $.ajax({
					type: "post",
					dataType:"json",
					url: "${ctx }/organize/checkEmpId",
					data:  "emp_id="+emp_id,
					success: function(data) {
						$('#emp_id').next().remove();
						if(data==true){//未被注册
							
						}else{//已被注册
							var spa = '<span class="help-block m-b-none" style="color: red;">该用户编号已被使用！</span>';
							$('#emp_id').after(spa);
						}
					}
			 });
        });
		</script>
  	</body>
</html>
